<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <title></title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <style>
        .flex{display: -webkit-box; display: -webkit-flex; display: flex;}
        html,body{
            background-color: transparent;
        }
        .arrow-02 {
            width: 0.12rem;
            height: 0.12rem;
            background-size: 0.12rem 0.12rem;
            background-image: url("../../image/my/arrow02.png");
            margin-right: 0.20rem;
        }
        input::-webkit-input-placeholder {
            text-align: end;
            color: #C4C5CE;
        }
        input {
            height: 0.50rem;
            width: 2.90rem;
            margin-right: 0.42rem;
            text-align: end;
            color: #26344C;
        }
    </style>
</head>
<body>
<div class="flex" style="width: 100%; height: 0.50rem; justify-content: flex-end; background-color: #FFFFFF">
    <div class="flex" style="width: 3.63rem; height: 0.50rem; justify-content: space-between; align-items: center; border-style: solid; border-bottom-width: 0.01rem; border-color: #EEEEEE;">
        <p style="font-size: 0.14rem; color: #83889A;">姓氏</p>
        <input id="family-name" placeholder="请输入您的姓氏">
    </div>
</div>
<div class="flex" style="width: 100%; height: 0.50rem; justify-content: flex-end; background-color: #FFFFFF">
    <div class="flex" style="width: 3.63rem; height: 0.50rem; justify-content: space-between; align-items: center; border-style: solid; border-bottom-width: 0.01rem; border-color: #EEEEEE;">
        <p style="font-size: 0.14rem; color: #83889A;">名字</p>
        <input id="given-name" placeholder="请输入您的名字">
    </div>
</div>
<div class="flex" style="width: 100%; height: 0.50rem; justify-content: flex-end; background-color: #FFFFFF">
    <div class="flex" style="width: 3.63rem; height: 0.50rem; justify-content: space-between; align-items: center; border-style: solid; border-bottom-width: 0.01rem; border-color: #EEEEEE;" tapmode onclick="changeSex()">
        <p style="font-size: 0.14rem; color: #83889A;">性别</p>
        <div class="flex" style="align-items: center;">
            <p id="sex" style="font-size: 0.14rem; color: #C4C5CE; margin-right: 0.10rem;">必填</p>
            <div class="arrow-02"></div>
        </div>
    </div>
</div>
<div class="flex" style="width: 100%; height: 0.50rem; justify-content: flex-end; background-color: #FFFFFF">
    <div class="flex" style="width: 3.63rem; height: 0.50rem; justify-content: space-between; align-items: center; border-style: solid; border-bottom-width: 0.01rem; border-color: #EEEEEE;" tapmode onclick="changeBirth()">
        <p style="font-size: 0.14rem; color: #83889A;">出生时间</p>
        <div class="flex" style="align-items: center;">
            <p id="birth" style="font-size: 0.14rem; color: #C4C5CE; margin-right: 0.10rem;">必填</p>
            <div class="arrow-02"></div>
        </div>
    </div>
</div>
</body>
</html>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/common/common.js"></script>
<script type="text/javascript">
    var familyNameEl, givenNameEl, sexEl, birthEl;
    var userInfo = [];
    var locked = 1, UIDatePicker;
    apiready = function () {
        familyNameEl = $api.byId('family-name');
        givenNameEl = $api.byId('given-name');
        sexEl = $api.byId('sex');
        birthEl = $api.byId('birth');

        UIDatePicker = api.require('UIDatePicker');
    }

    function changeSex() {
        if (locked == 1) {
            familyNameEl.blur();
            givenNameEl.blur();
            api.actionSheet({
                cancelTitle: '取消',
                buttons: ['男', '女']
            }, function(ret, err) {
                var index = ret.buttonIndex;
                if (index == 1) {
                    $api.text(sexEl, "男");
                    userInfo['sex'] = 0;
                    $api.css(sexEl,'color: #26344C;');
                } else if (index == 2) {
                    $api.text(sexEl, "女");
                    userInfo['sex'] = 1;
                    $api.css(sexEl,'color: #26344C;');
                }
            });
        }
    }

    function changeBirth() {
        if (locked == 1) {
            familyNameEl.blur();
            givenNameEl.blur();
            var date = fun_date(0), theDate;
            UIDatePicker.open({
                type: 'dateHourMinute',
                // date: theDate + " 00:00:00",
                rowHeight:40,
                maxDate:date['date'] + " 24:59:59",
                title: '选择日期',
                styles: {
                    bg: 'rgba(0,0,0,0)',
                    headerViewBackgroundColor:'rgba(0,0,0,0)',
                    lineBackgroundColor: 'rgba(223,223,228,0.3)',
                    item:{
                        normal: '#666666',
                        normalFont: 16,
                        selected: '#24253D',
                        selectedFont: 20,
                        cancelBtn:{
                            cancelButtonTextColor: '#A0522C',
                            cancelButtonText: '取消' ,
                            cancelButtonFont:16
                        },
                        confirmBtn:{
                            confirmButtonTextColor: '#A0522C',
                            confirmButtonText: '确认' ,
                            confirmButtonFont:16
                        },
                    }
                },
            }, function(ret, err) {
                if (ret) {
                    // alert(JSON.stringify(ret));
                    if (ret.eventType == "submit") {
                        var year = ret.year;
                        userInfo['birth_year'] = year;

                        var month = ret.month;
                        userInfo['birth_month'] = month;
                        if (month<10) {
                            month = "0" + month;
                        }
                        var day = ret.day;
                        userInfo['birth_day'] = day;
                        if (day<10) {
                            day = "0" + day;
                        }
                        var hour = ret.hour;
                        userInfo['birth_hour'] = hour;
                        if (hour<10) {
                            hour = "0" + hour;
                        }
                        var minute = ret.minute;
                        userInfo['bitth_minute'] = minute;
                        if (minute<10) {
                            minute = "0" + minute;
                        }

                        let data1=year + "-" + month + "-" + day + " " + hour + ":" + minute + ":" + "00";
                        userInfo['birthday']=new Date(Date.parse(data1.replace(/-/g, "/"))).getTime()/1000;

                        $api.text(birthEl, year + "年" + month + "月" + day + "日 " + hour + ":" + minute);

                        $api.css(birthEl,'color: #26344C;');
                    }
                } else {
                    // alert(JSON.stringify(err));
                }
            });
        }
    }

    function addMember() {
        if (familyNameEl.value.length == 0) {
            api.toast({
                msg: "请输入姓氏",
                duration: 2000,
                location: 'middle'
            });
            return;
        }
        if (givenNameEl.value.length == 0) {
            api.toast({
                msg: "请输入姓名",
                duration: 2000,
                location: 'middle'
            });
            return;
        }
        if (userInfo['sex'] == undefined) {
            api.toast({
                msg: "请输选择性别",
                duration: 2000,
                location: 'middle'
            });
            return;
        }
        if (userInfo['birthday'] == undefined) {
            api.toast({
                msg: "请输选择出生时间",
                duration: 2000,
                location: 'middle'
            });
            return;
        }
        locked = 0;
        var temApiHeader = {
            "Content-Type": "application/json",
        };
        var tem = {
                token: $api.getStorage("token"),
                family_name: familyNameEl.value,
                given_name: givenNameEl.value,
                sex: userInfo['sex'],
                // birthday: userInfo['birthday'],
                birth_year: parseInt(userInfo['birth_year']),
                birth_month: parseInt(userInfo['birth_month']),
                birth_day: parseInt(userInfo['birth_day']),
                birth_hour: parseInt(userInfo['birth_hour']),
                birth_minute: parseInt(userInfo['bitth_minute']),
        };
        api.ajax({
            url: apiUrl + '/tools/add-member',
            tag: '/tools/add-member',
            method: 'post',
            headers: temApiHeader,
            data: {
                body: {
                    token: $api.getStorage("token"),
                    family_name: familyNameEl.value,
                    given_name: givenNameEl.value,
                    sex: userInfo['sex'],
                    // birthday: userInfo['birthday'],
                    birth_year: parseInt(userInfo['birth_year']),
                    birth_month: parseInt(userInfo['birth_month']),
                    birth_day: parseInt(userInfo['birth_day']),
                    birth_hour: parseInt(userInfo['birth_hour']),
                    birth_minute: parseInt(userInfo['bitth_minute']),
                }
            }
        }, function(ret, err) {
            if (ret) {
                if (ret.code == 0) {
                    api.execScript({
                        name: 'main',
                        frameName: 'frame5',
                        script: 'getTodayFortune(' + ret.data.member_id + ', "' + familyNameEl.value + givenNameEl.value + '");'
                    });
                    api.closeWin();
                } else {
                    api.toast({
                        msg: ret.err_msg,
                        duration: 2000,
                        location: 'middle'
                    });
                }
                locked = 1;
            } else {
                // api.alert({ msg: JSON.stringify(err) });
            }
        });
    }
</script>
